<script setup>
import { ElMessageBox } from 'element-plus';
import { ref, onMounted } from 'vue';
import { get, host } from '../js/http';


const props = defineProps({projectId:String})
const exist = ref(false);
const loading = ref(false)

const deving = () => {
    ElMessageBox.alert('正在开发中……','提示',{type:'warning', confirmButtonText:'确认'})
}

const existFinallyFile = () => {
    loading.value = true;
    get('/routing/result/exist',{projectId:props.projectId}).then(res=>{
        if(res.status){
            exist.value = res.data
        }
        loading.value = false;
    })
}

const getRoutingImageZip = () => {
    location.href = host + '/routing/result/routingImageZip?projectId='+props.projectId
}

onMounted(()=>{
    existFinallyFile()
})

</script>

<template>
    <div class="project-file" v-loading="loading">
        <div class="list" v-if="exist">
            <div class="item" @click="getRoutingImageZip">
                <img src="../assets/zip.png"/>
                <span class="title">交路图.zip</span>
            </div>
            <div class="item" @click="deving">
                <img src="../assets/xml.png"/>
                <span class="title">Routing.xml</span>
            </div>
        </div>
        <el-empty description="暂无成果物" v-else></el-empty>
    </div>
</template>
<style scoped>
.project-file{
    padding: 10px;
    height: calc(100vh - 80px);
    background-color: var(--el-color-info-light-9);
}
.list{
    display: flex;
}
.item{
    width: 200px;
    height: 200px;
    text-align: center;
    font-size: 14px;
    margin: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid var(--el-color-info-light-7);
    justify-content: center;
    border-radius: 4px;
    cursor: pointer;
    background-color: white;
}
.item:hover{
    background-color: var(--el-color-primary-light-9);
}
.info{
    padding-top: 10px;
    font-size: 12px;
    color: var(--el-color-info);
}
.title{
    padding-top: 10px;
}
</style>